import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:smart_devices/bruno/src/components/button/brn_normal_button.dart';
import 'package:smart_devices/bruno/src/components/toast/brn_toast.dart';
import 'package:smart_devices/icons/src/ant_design.dart';
import 'package:smart_devices/routes/index.dart';
import 'package:smart_devices/service/shared_preference.dart';
import 'package:smart_devices/ui/draw_under_line.dart';
import 'package:smart_devices/utils/colors.dart';
import 'package:smart_devices/utils/file_path.dart';
import 'package:smart_devices/utils/styles.dart';
import 'package:smart_devices/utils/tools.dart';

class MineController extends GetxController with GetTickerProviderStateMixin {
  RxString name = RxString('赵小刚');
  RxString postName = RxString('部门主管');
  RxString deptName = RxString('生产部门');
  RxBool visible = RxBool(false);

  late ScrollController scrollController;

  RxString version = RxString('1.0.0');

  double limitHeight = 189.0;

  @override
  void onInit() {
    super.onInit();
    ToolsUtils.appInfo().then((app) {
      version.value = app.version;
    });
    scrollController = ScrollController()
      ..addListener(() {
        if (scrollController.offset > limitHeight) {
          visible.value = true;
          return;
        }
        visible.value = false;
      });
  }

  @override
  void onClose() {
    super.onClose();
    scrollController.dispose();
    Get.delete();
  }
}

class MinePage extends GetView<MineController> {
  const MinePage({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder(
      builder: (_) {
        return Scaffold(
            backgroundColor:
                ColorsUtils.parseColorFromHexString(ColorsUtils.colorF6f6),
            appBar: appBar(),
            body: customScroll(context));
      },
      init: Get.put(MineController()),
    );
  }

  double get appBarHeight {
    return 50 + Get.mediaQuery.padding.top;
  }

  Widget customScroll(BuildContext context) {
    return CustomScrollView(
      controller: controller.scrollController,
      slivers: [
        stackView(),
        Obx(() => SliverVisibility(
              sliver: SliverPersistentHeader(
                pinned: true,
                delegate: SliverHeaderDelegate.fixedHeight(
                    height: 100,
                    child: Container(
                      padding: const EdgeInsets.symmetric(horizontal: 10),
                      decoration: const BoxDecoration(color: Colors.white),
                      child: GridView.count(
                        crossAxisCount: 4,
                        crossAxisSpacing: 0,
                        padding: const EdgeInsets.all(10),
                        physics: const NeverScrollableScrollPhysics(),
                        children: [
                          SizedBox(
                            child: Column(
                              children: [
                                Container(
                                  height: 50,
                                  alignment: Alignment.center,
                                  child: ToolsUtils.assetImageSvg('u62092.svg',
                                      width: 26, height: 30),
                                ),
                                Container(
                                  height: 30,
                                  alignment: Alignment.center,
                                  child: Text(
                                    '我的报修',
                                    style: StylesUtils.customTextStyle(
                                        color: ColorsUtils.color4950,
                                        fontSize: 13),
                                  ),
                                )
                              ],
                            ),
                          ),
                          SizedBox(
                            child: Column(
                              children: [
                                Container(
                                  height: 50,
                                  alignment: Alignment.center,
                                  child: ToolsUtils.assetImageSvg('u62103.svg',
                                      width: 26, height: 30),
                                ),
                                Container(
                                  height: 30,
                                  alignment: Alignment.center,
                                  child: Text(
                                    '我的维修',
                                    style: StylesUtils.customTextStyle(
                                        color: ColorsUtils.color4950,
                                        fontSize: 13),
                                  ),
                                )
                              ],
                            ),
                          ),
                          SizedBox(
                            child: Column(
                              children: [
                                Container(
                                  height: 50,
                                  alignment: Alignment.center,
                                  child: ToolsUtils.assetImageSvg('u62109.svg',
                                      width: 26, height: 30),
                                ),
                                Container(
                                  height: 30,
                                  alignment: Alignment.center,
                                  child: Text(
                                    '我的保养',
                                    style: StylesUtils.customTextStyle(
                                        color: ColorsUtils.color4950,
                                        fontSize: 13),
                                  ),
                                )
                              ],
                            ),
                          ),
                          SizedBox(
                            child: Column(
                              children: [
                                Container(
                                  height: 50,
                                  alignment: Alignment.center,
                                  child: ToolsUtils.assetImageSvg('u62118.svg',
                                      width: 26, height: 30),
                                ),
                                Container(
                                  height: 30,
                                  alignment: Alignment.center,
                                  child: Text(
                                    '点检巡检',
                                    style: StylesUtils.customTextStyle(
                                        color: ColorsUtils.color4950,
                                        fontSize: 13),
                                  ),
                                )
                              ],
                            ),
                          )
                        ],
                      ),
                    )),
              ),
              visible: controller.visible.value,
            )),
        SliverToBoxAdapter(
          child: Container(
            margin: const EdgeInsets.only(left: 10, right: 10, top: 10),
            decoration: const BoxDecoration(color: Colors.white),
            child: DrawUnderLine(
                child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                  width: 100,
                  height: 60,
                  alignment: Alignment.centerRight,
                  child: Text(
                    '修改密码',
                    style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color3333),
                  ),
                ),
                InkWell(
                  onTap: () {},
                  child: Container(
                    width: 40,
                    height: 60,
                    alignment: Alignment.center,
                    child: Icon(
                      AntDesign.right,
                      color: ColorsUtils.parseColorFromHexString(
                        ColorsUtils.color9999,
                      ),
                      size: 15,
                    ),
                  ),
                )
              ],
            )),
          ),
        ),
        SliverToBoxAdapter(
          child: Container(
            margin: const EdgeInsets.symmetric(horizontal: 10),
            decoration: const BoxDecoration(color: Colors.white),
            child: DrawUnderLine(
                child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                  width: 100,
                  height: 60,
                  alignment: Alignment.centerRight,
                  child: Text(
                    '清除缓存',
                    style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color3333),
                  ),
                ),
                InkWell(
                  onTap: () {
                    FilePathUtils.clearCache().then((value) {
                      BrnToast.show('清除完毕', context,
                          gravity: BrnToastGravity.bottom,
                          duration: const Duration(seconds: 2));
                    });
                  },
                  child: Container(
                    width: 40,
                    height: 60,
                    alignment: Alignment.center,
                    child: Icon(
                      AntDesign.right,
                      color: ColorsUtils.parseColorFromHexString(
                        ColorsUtils.color9999,
                      ),
                      size: 15,
                    ),
                  ),
                )
              ],
            )),
          ),
        ),
        SliverToBoxAdapter(
          child: Container(
            margin: const EdgeInsets.symmetric(horizontal: 10),
            decoration: const BoxDecoration(color: Colors.white),
            child: DrawUnderLine(
                child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                  width: 100,
                  height: 60,
                  alignment: Alignment.centerRight,
                  child: Text(
                    '更新版本',
                    style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color3333),
                  ),
                ),
                Wrap(
                  spacing: 10,
                  children: [
                    Container(
                      width: 100,
                      height: 60,
                      alignment: Alignment.center,
                      child: FractionallySizedBox(
                        heightFactor: 0.5,
                        widthFactor: 1.0,
                        child: BrnNormalButton(
                            onTap: () {},
                            textStyle:
                                StylesUtils.customTextStyle(fontSize: 13),
                            backgroundColor:
                                ColorsUtils.parseColorFromHexString(
                                    ColorsUtils.colorFf31),
                            text: '',
                            child: Obx(
                                () => Text('新版本${controller.version.value}'))),
                      ),
                    ),
                    InkWell(
                      onTap: () {},
                      child: Container(
                        width: 40,
                        height: 60,
                        alignment: Alignment.center,
                        child: Icon(
                          AntDesign.right,
                          color: ColorsUtils.parseColorFromHexString(
                            ColorsUtils.color9999,
                          ),
                          size: 15,
                        ),
                      ),
                    )
                  ],
                )
              ],
            )),
          ),
        ),
        SliverToBoxAdapter(
          child: Container(
            margin: const EdgeInsets.symmetric(horizontal: 10),
            decoration: const BoxDecoration(color: Colors.white),
            child: DrawUnderLine(
                child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                  width: 100,
                  height: 60,
                  alignment: Alignment.centerRight,
                  child: Text(
                    '关于我们',
                    style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color3333),
                  ),
                ),
                InkWell(
                  onTap: () {},
                  child: Container(
                    width: 40,
                    height: 60,
                    alignment: Alignment.center,
                    child: Icon(
                      AntDesign.right,
                      color: ColorsUtils.parseColorFromHexString(
                        ColorsUtils.color9999,
                      ),
                      size: 15,
                    ),
                  ),
                )
              ],
            )),
          ),
        ),
        SliverToBoxAdapter(
          child: Container(
            margin:
                const EdgeInsets.only(left: 10, right: 10, top: 20, bottom: 20),
            height: 40,
            child: FractionallySizedBox(
              child: BrnNormalButton(
                  onTap: () {
                    SharedPreferenceService.to
                        .remove(SharedPreferenceService.token)
                        .then((value) {
                      Get.toNamed(Routes.login);
                    });
                  },
                  text: '退出登录',
                  textStyle: StylesUtils.customTextStyle(fontSize: 16),
                  borderRadius: BorderRadius.circular(8),
                  backgroundColor: ColorsUtils.parseColorFromHexString(
                      ColorsUtils.color0052)),
            ),
          ),
        )
      ],
    );
  }

  Widget stackView() {
    return SliverToBoxAdapter(
      child: SizedBox(
        height: 200,
        child: Stack(
          children: [
            Container(
              height: 120,
              decoration: BoxDecoration(
                  color: ColorsUtils.parseColorFromHexString(
                      ColorsUtils.color0052)),
              child: Row(
                children: [
                  Container(
                    constraints: BoxConstraints.tight(const Size.square(90)),
                    alignment: Alignment.center,
                    child: const CircleAvatar(
                      radius: 30,
                      backgroundImage: NetworkImage(
                          'https://img2.baidu.com/it/u=1176059952,909323801&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'),
                    ),
                  ),
                  Expanded(
                      child: Container(
                    padding: const EdgeInsets.only(top: 30),
                    child: Column(
                      children: [
                        Container(
                            height: 24,
                            alignment: Alignment.centerLeft,
                            child: Obx(() => Text.rich(TextSpan(children: [
                                  TextSpan(
                                      text: controller.name.value,
                                      style: StylesUtils.customTextStyle(
                                          fontWeight: FontWeight.w700)),
                                  TextSpan(
                                      text: ' ${controller.postName.value}',
                                      style: StylesUtils.customTextStyle())
                                ])))),
                        Container(
                            height: 24,
                            alignment: Alignment.centerLeft,
                            child: Obx(() => Text.rich(TextSpan(children: [
                                  TextSpan(
                                      text: controller.deptName.value,
                                      style: StylesUtils.customTextStyle(
                                          fontWeight: FontWeight.w700)),
                                ])))),
                      ],
                    ),
                  ))
                ],
              ),
            ),
            Positioned(
              height: 100,
              bottom: 0,
              left: 0,
              right: 0,
              child: Container(
                height: 100,
                margin: const EdgeInsets.symmetric(horizontal: 10),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(5),
                ),
                child: GridView.count(
                  crossAxisCount: 4,
                  crossAxisSpacing: 0,
                  padding: const EdgeInsets.all(10),
                  physics: const NeverScrollableScrollPhysics(),
                  children: [
                    InkWell(
                      onTap: () {
                        Get.toNamed(Routes.mineRepair);
                      },
                      child: SizedBox(
                        child: Column(
                          children: [
                            Container(
                              height: 50,
                              alignment: Alignment.center,
                              child: ToolsUtils.assetImageSvg('u62092.svg',
                                  width: 26, height: 30),
                            ),
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Text(
                                '我的报修',
                                style: StylesUtils.customTextStyle(
                                    color: ColorsUtils.color4950, fontSize: 13),
                              ),
                            )
                          ],
                        ),
                      ),
                    ),
                    InkWell(
                      onTap: () {
                        Get.toNamed(Routes.mineMaintain);
                      },
                      child: SizedBox(
                        child: Column(
                          children: [
                            Container(
                              height: 50,
                              alignment: Alignment.center,
                              child: ToolsUtils.assetImageSvg('u62103.svg',
                                  width: 26, height: 30),
                            ),
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Text(
                                '我的维修',
                                style: StylesUtils.customTextStyle(
                                    color: ColorsUtils.color4950, fontSize: 13),
                              ),
                            )
                          ],
                        ),
                      ),
                    ),
                    InkWell(
                      onTap: () {
                        Get.toNamed(Routes.mineUpkeep);
                      },
                      child: SizedBox(
                        child: Column(
                          children: [
                            Container(
                              height: 50,
                              alignment: Alignment.center,
                              child: ToolsUtils.assetImageSvg('u62109.svg',
                                  width: 26, height: 30),
                            ),
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Text(
                                '我的保养',
                                style: StylesUtils.customTextStyle(
                                    color: ColorsUtils.color4950, fontSize: 13),
                              ),
                            )
                          ],
                        ),
                      ),
                    ),
                    InkWell(
                      onTap: () {
                        Get.toNamed(Routes.mineInspect);
                      },
                      child: SizedBox(
                        child: Column(
                          children: [
                            Container(
                              height: 50,
                              alignment: Alignment.center,
                              child: ToolsUtils.assetImageSvg('u62118.svg',
                                  width: 26, height: 30),
                            ),
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Text(
                                '点检巡检',
                                style: StylesUtils.customTextStyle(
                                    color: ColorsUtils.color4950, fontSize: 13),
                              ),
                            )
                          ],
                        ),
                      ),
                    )
                  ],
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  AppBar appBar() {
    return AppBar(
      automaticallyImplyLeading: false,
      title: Text(
        '我的',
        style: StylesUtils.customTextStyle(
            fontSize: 16, fontWeight: FontWeight.w700),
      ),
      centerTitle: true,
      backgroundColor:
          ColorsUtils.parseColorFromHexString(ColorsUtils.color0052),
      elevation: 0,
    );
  }
}

typedef SliverHeaderBuilder = Widget Function(
    BuildContext context, double shrinkOffset, bool overlapsContent);

class SliverHeaderDelegate extends SliverPersistentHeaderDelegate {
  final double maxHeight;
  final double minHeight;
  final SliverHeaderBuilder builder;

  SliverHeaderDelegate(
      {required this.maxHeight, this.minHeight = 0, required Widget child})
      : builder = ((a, b, c) => child),
        assert(minHeight <= maxHeight && minHeight >= 0);

  //最大和最小高度相同
  SliverHeaderDelegate.fixedHeight({
    required double height,
    required Widget child,
  })  : builder = ((a, b, c) => child),
        maxHeight = height,
        minHeight = height;

  //需要自定义builder时使用
  SliverHeaderDelegate.builder({
    required this.maxHeight,
    this.minHeight = 0,
    required this.builder,
  });

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    Widget child = builder(context, shrinkOffset, overlapsContent);
    return SizedBox.expand(child: child);
  }

  @override
  double get maxExtent => maxHeight;

  @override
  double get minExtent => minHeight;

  @override
  bool shouldRebuild(covariant SliverPersistentHeaderDelegate oldDelegate) {
    return oldDelegate.maxExtent != maxExtent ||
        oldDelegate.minExtent != minExtent;
  }
}
